/**
* Created by yyr on 2018/3/14
*已投资基金》列表页
*/
<template>
    <div>
        <div class="right">
            <el-row>
                <el-col :span="6" class="ca-title">
                    <h3 v-if="FOF">已投资基金</h3>
                    <h3 v-else>已设立基金</h3>
                </el-col>
                <el-col :span="6" class="ca-pull-right ca-align-right">
                    <el-button class="ca-color-download" icon="el-icon-plus" @click="fundAdd" :disabled="!isAddFundAuth" v-if="FOF">新建已投资基金</el-button>
                    <el-button class="ca-color-download" icon="el-icon-plus" @click="fundAdd" :disabled="!isAddFundAuth" v-else>新建已设立基金</el-button>
                </el-col>
            </el-row>
          <el-form label-position="right" class="ca-box ca-list-title">
                <el-row>
                    <el-col :span="6">
                        <el-form-item label="基金类型" label-width="90px">
                            <el-select  placeholder="请选择" style="width: 100%" v-model="param.fundType">
                                <el-option
                                    v-for="item in initView.fundType"
                                    :label="item.name"
                                    :key="item.id"
                                    :value="item.id">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="基金名称" label-width="90px">
                            <el-input placeholder="支持模糊查询" v-model="param.name" @keyup.native.13="getFundList"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10" class="ca-pull-right ca-align-right">
                        <el-button type="primary" @click="getFundList">查询</el-button>
                        <el-button type="primary" @click="downloadFile" :disabled="!isDownLoadAuth">下载</el-button>
                    </el-col>
                </el-row>
            </el-form>
            <el-table class="ca-table" :data="fundData"  @sort-change="sortChange">
                <el-table-column label="序号" type="index" width="70px" align="center">
                    <template slot-scope="scope">
                        <csRedDot :label="(param.pageIndex-1)*param.pageSize+scope.$index+1+''"
                                  :showDot="scope.row.red == 1?true:false" :type="1"></csRedDot>
                    </template>
                </el-table-column>
                <el-table-column
                    label="基金名称"
                    prop="fundName">
                    <template slot-scope="scope">
                        <el-tooltip :content="scope.row.fundName" placement="top" class="item">
                            <el-button type="text"
                                       :disabled="authFun()"
                                       @click="toFundDetail(scope.row)"
                                       class="ca-underline ca-text-over-flow-ellipsis">{{scope.row.fundName}}</el-button>
                        </el-tooltip>
                    </template>
                </el-table-column>
                <el-table-column label="管理机构" prop="mechanism"></el-table-column>
                <el-table-column label="成立时间" prop="estTime" sortable="custom"></el-table-column>
                <el-table-column label="存续期" prop="duration" sortable="custom"></el-table-column>
                <el-table-column
                    label="基金规模</br>(万元)"
                     prop="scale"
                     sortable="custom"
                     :render-header="renderTitle">
                    <template slot-scope="scope">
                        {{scope.row.scale | format1}}
                    </template>
                </el-table-column>
                <el-table-column
                    label="实缴规模</br>(万元)"
                    prop="paid"
                    sortable="custom"
                    :render-header="renderTitle">
                    <template slot-scope="scope">
                        {{scope.row.paid | format1}}
                    </template>
                </el-table-column>
                <el-table-column label="投资项目</br>个数" prop="inTheVote" sortable="custom" :render-header="renderTitle"></el-table-column>
                <el-table-column
                    label="投资项目金额</br>(万元)"
                    prop="amountInvested"
                    sortable="custom"
                    :render-header="renderTitle">
                    <template slot-scope="scope">
                        {{scope.row.amountInvested | format1}}
                    </template>
                </el-table-column>
                <el-table-column label="投资母基金" v-if="FOF">
                    <template slot-scope="scope">
                        <div v-for="item in scope.row.quasiFundReserveFOFList">
                            <el-button type="text"
                               @click="toMotherFundDetail(item.id)"
                                       :disabled="item.existence"
                               class="ca-underline ca-text-over-flow-ellipsis">
                                {{item.fundName}}</el-button>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="操作">
                    <template slot-scope="scope">
                        <el-button @click="deleteData(scope.row.id)" type="text" :disabled="!isDeleteFundAuth">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </div>
        <div class="ca-m-t-20 ca-align-center">
            <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="param.pageIndex"
                :page-sizes="vuePageSizes"
                :page-size="param.pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="totalCount">
            </el-pagination>
        </div>
    </div>
</template>

<script type="text/ecmascript-6">
        import {api} from './api';
        import {STATUS_HTTP_SUCCESS, apiHttp} from '__service/csHttp';
        import { isNoAuth } from '__service/utils';
    export default {
        data() {
            return {
                isAddFundListAuth: isNoAuth('已投资基金-列表页-查看'),
                isAddFundAuth: isNoAuth('已投资基金-列表页-新建'),
                isDeleteFundAuth: isNoAuth('已投资基金-列表页-删除'),
                isDownLoadAuth: isNoAuth('已投资基金-列表页-下载'),
                isAuthFundDetail: isNoAuth('已投资基金-基金详情-查看'),
                isAuthPartnerSee: isNoAuth('已投资基金-合伙人认缴-查看'),
                isAuthManageSee: isNoAuth('已投资基金-管理费核定-查看'),
                isAuthInvestedSee: isNoAuth('已投资基金-投资数据-查看'),
                isAuthDistributionSee: isNoAuth('已投资基金-基金分配-查看'),
                isAuthRecordSee: isNoAuth('已投资基金-管理记录-查看'),
                isAuthApproveSee: isNoAuth('已投资基金-重大事项审批-查看'),
                isAuthFileSee: isNoAuth('已投资基金-基金文档-查看'),
                isAuthExpendSee: isNoAuth('已投资基金-基金支出-查看'),
                isAuthIdleSee: isNoAuth('已投资基金-闲散理财-查看'),
                initView: {
                    fundType: [{id: '', name: '全部'}, ...this.$store.state.user.dictionaryMap.fundType],//基金类型
                },
                param: {
                    name: '',
                    fundType: '',
                    pageIndex: 1,
                    fundState: 0,//已设立基金
                    pageSize: 30,
                    orderBy: '',
                    sort: '',//desc降序
                },//查询参数
                paramCopy: {
                    name: '',
                    fundType: '',
                    pageIndex: 1,
                    fundState: 0,//已设立基金
                    pageSize: 30,
                    orderBy: '',
                    sort: '',//desc降序
                },//查询参数
                fundData: [],//列表数据
                totalCount: null,
                size: null, //当前页的数量
                totalPage: null, //总页数
                keyName: '',
            };
        },
        beforeRouteEnter(to, from, next) {
            next(vm=>{
                if (!vm.isAddFundListAuth) {
                    vm.$message({
                        message: '没有此页面的操作权限',
                        type: 'error',
                        center: true
                    });
                    vm.$router.replace({name: 'personal-center', params: {tabIndex: '0'}})
                    return;
                }
            });
        },
        created() {
        },
        mounted() {
            this.getFundList();
        },
        methods: {
            //查询
            getFundList() {
                this.keyName = this.param.name;
                apiHttp(api.EST_FUNDS,this.param).then( ret=>{
                    if (ret.resCode === STATUS_HTTP_SUCCESS) {
                        this.fundData = ret.data.resultData;
                        this.totalPage = ret.data.totalPage;  //总页数
//                        this.size = ret.data.size;   //当前页的数量
                        this.totalCount = ret.data.totalCount; //总记录数
                        this.paramCopy = Object.assign({}, this.param);
                    }
                })
            },
            //新建已投资基金
            fundAdd() {
                this.$router.push({name: 'invested-fund-add', params: {itemId: '-1',tabIndex: '0', openWindow: true}})
            },
            //跳转母基金详情
            toMotherFundDetail(id) {
                this.$router.push({name: 'invested-FOF', params: {itemId: id, tabIndex: 0, openWindow: true}})
            },
            //跳转已设立基金详情
            toFundDetail(item) {
                this.$router.push({name: 'invested-fund', params: {fundId: item.id, tabIndex: 0, openWindow: true}})
            },
            //删除已投资基金
            deleteData(id) {
                this.$confirm('是否删除此项目?', '提示', {
                    cancelButtonText: '取消',
                    confirmButtonText: '确定',
                    type: 'warning',
                    showClose: false
                }).then(async () => {
                    apiHttp(api.DELETE_FUND,{id: id}).then(ret=> {
                        if (ret.resCode === STATUS_HTTP_SUCCESS) {
                            this.$message({
                                type: 'success',
                                message: '删除成功!',
                                center: true
                            });
                            this.getFundList()
                        }
                    });
                });
            },
            // 改变每页显示的条数
            handleSizeChange(val) {
                this.param.pageSize = val;
                this.getFundList();
            },
            // 改变当前页
            handleCurrentChange(val) {
                this.param.pageIndex = val;
                if (val > this.totalPage) {
                    this.param.pageIndex = this.totalPage
                }
                this.getFundList();
            },
            //排序
            authFun() {
                return !(this.isAuthFundDetail || this.isAuthPartnerSee || this.isAuthManageSee || this.isAuthInvestedSee || this.isAuthDistributionSee || this.isAuthRecordSee || this.isAuthApproveSee || this.isAuthFileSee || this.isAuthExpendSee || this.isAuthIdleSee)
            },
            sortChange(params) {
                if (!params.order) {
                    this.param.orderBy = '';
                    this.param.sort = '';
                } else {
                    this.param.sort = params.order === 'ascending' ? 'asc' : 'desc';
                    this.param.orderBy = params.prop;
                    this.getFundList();
                }
            },
            ///文件下载
            downloadFile() {
                if (this.fundData.length === 0) {
                    this.$message({
                        type: 'warning',
                        message: '无数据!',
                        center: true
                    });
                } else {
                    window.open(this.baseURL + api.DOWNLOAD_FILE.url + '?X-Token=' + this.$store.state.user.token + '&type=6&name=' + this.paramCopy.name + '&fundState=0&fundType=' + this.paramCopy.fundType );
                }
            },
        },
        components: {
            csRedDot: require('__components/red-dot'), // 小红点
        },
    }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
    .ca-list-title {
        margin: 15px 0;
        padding: 20px 20px 0 20px;
    }
</style>
